$('body').click(e=>{
    var x = e.clientX
    var y = e.clientY
    shoot(x,y)
})
var count
var alpha = 1
// var count = rand(10,30);//烟花个数
function draw(x1,y1){   
    /* var index=0
    if(index>=1){$(`span:lt(${count})`).remove() }
            index++*/
    // console.log($(`span:lt(${count})`))
    count = rand(30,40)
    //  console.log(count);
    for(var i=0;i<count;i++){
    //    console.log(count);
       var r = rand(50,1000)
        var angle = 360/count*i //烟花粒子分布角度
        var radians = angle * Math.PI / 180;//L=n× π× r/180 弧度公式 烟花相聚的弧度 因为没有 角度单位所以 弧度 变 角度  180/π×弧度
       
       var pot =  $("<span></span>")
       $('body').append(pot)
        pot.css({'left':`${x1}px`,'top':`${y1}px`,'background':color()})//当前位置  
     var coords_x = x1+Math.cos(radians)*r
     var coords_y = y1+Math.sin(radians)*r  //+r*speed/10//让他的定位一直在做一个抛物
     properties = ({'left':`${coords_x}px`,'top':`${coords_y}px`,'background':color(),'opacity':'0'})          
            pot.animate(properties,600)
            // return count
            // console.log(count);       
   }      

} 

    
/* ; //定时删掉之前的烟花 */
// $('span:lt(count)').remove()

function shoot(x,y){
    var shot = $("<div></div>")
   
    $('body').append(shot)
    shot.css({'left':'0px','bottom':'0px'})
    properties=({'left':`${x}px`,'top':`${y}px`})
    shot.animate(properties,300,function(){
        setTimeout(() => {
            $('div:lt(1)').remove()
        }, 200)
        draw(x,y)
    })
       
}








   function rand(min,max){
    return parseInt(Math.random()*(max-min+1))+min;
}

function color(){
    var str = "#";
    for(var i=0;i<6;i++){
        str += rand(0,15).toString(16);
    }
    return str;
}